<!--
 * @Author: your name
 * @Date: 2021-07-15 09:40:44
 * @LastEditTime: 2021-07-15 16:09:52
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \workspace\ecjtuNews\src\views\components\articleHead.vue
-->
<template>
  <div class="local">
    <h3>{{ title }}</h3>
    <div class="right">
      <img src="/images/pic4.png" alt="">
      <a @click="toIndex()">新闻网首页</a>
      >
      <a>{{ title }}</a>
      <slot name="text">> 正文</slot>
      
    </div>
  </div>
</template>


<script>
export default {  
    watch:{
    '$route.query':{
      handler(query){
        this.param.categoryId = query.categoryId;
        this.title = query.name
        this.loadName()
      },
      deep:true
    }
  },
    data() {
        return {
            title: '标题头部'
        }
    },
    methods:{
      toIndex(){
        this.$router.push({path:"/"})
    },
    loadName(){
this.title = this.$route.query.name;
    }
    },
    created(){
        // 文章头部分类名字
        this.loadName()
    }
    
}
</script>

<style scoped>
.local {
  width: 75%;
  height: 60px;
  line-height: 60px;
  border-bottom: 1px solid #cecece;
  margin:0 auto 30px;
}

.local h3 {
  color: #484848;
  margin: 0;
  font-size: 24px;
  font-weight: bolder;
  float: left;
  font-family: 'Microsoft YaHei';
}

.local .right {
  float: right;
  font-size: 12px;
  padding-left: 16px;
}

.local .right img{
  margin-bottom: -3px;  
}

.right a {
  line-height: 70px;
  padding: 0 6px;
  text-decoration: none;
  color: #333;
  cursor: pointer;
}
</style>